<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>天天生鲜</title>
    <link rel="stylesheet" href="CSS/reset.css">
    <link rel="stylesheet" href="CSS/main.css">
    <script src="../../../../JS/jquery-1.12.4.min.js"></script>
    <script>
        // $.ajax({
        //     url: 'json/0001try.json',
        //     type: 'get',
        //     dataType: 'json',
        //     success: function (dat) {
        //         console.log(dat);
        //         $('.unlogin').hide();
        //         $('.logined a').html(dat.name).parent().show();
        //     },
        //     error: function () {
        //         alert('失败');
        //     }
        // })

        // $.getJSON('json/0001try.json', function (dat) {
        //     console.log(dat);
        //     $('.unlogin').hide();
        //     $('.logined a').html(dat.name).parent().show();
        // });

        // 0007
        // $.ajax({
        //     url: 'json/0001try.json',
        //     type: 'get',
        //     dataType: 'json',
        //     success: function (dat01) {
        //         // console.log(dat01);
        //         $.ajax({
        //             url: 'json/0007_data.json',
        //             type: 'get',
        //             dataType: 'json',
        //             success: function (dat02) {
        //                 console.log([dat01, dat02]);
        //             },
        //             error: function (err) {
        // 
        //             }
        //         })
        //     },
        //     error: function (err) {
        //     }
        // })

        let pro01 = new Promise(function (resolve, rejct) {
            $.ajax({
                url: 'json/0007_data.json',
                type: 'get',
                dataType: 'json',
                success: function (dat) {
                    resolve(dat);
                },
                error: function (err) {
                    rejct(err);
                }
            })
        })
        let pro02 = new Promise(function (resolve, rejct) {
            $.ajax({
                url: 'json/0001try.json',
                type: 'get',
                dataType: 'json',
                success: function (dat) {
                    resolve(dat);
                },
                error: function (err) {
                    rejct(err);
                }
            })
        })

        pro01.then(function (dat) {
            console.log(dat);
        })

        Promise.all([pro01, pro02]).then(re => {
            console.log(re);
        })
    </script>
</head>
<body>
    <!-- 1.login部分 欢迎来到天天生鲜 -->
    <div class="login">
        <div class="login-content">
            <!-- 1.1左侧天天生鲜 -->
            <h3 class="lf">欢迎来到天天生鲜!</h3>
            <!-- 1.2右侧 我的订单 -->
            <div class="rightorder rf">
            <!-- 1.2.1已经登录 -->
            <div class="logined">
                欢迎您：
                <a href="">张山</a>
            </div>
            <!-- 1.2.2未登录 -->
            <div class="unlogin lf">
                <a href="">登录</a>
                <span>|</span>
                <a href="">注册</a>
            </div>
            <!-- 1.2.3我的订单 -->
            <div class="myorder lf">
                <span>|</span>
                <a href="">我的购物车</a>
                <span>|</span>
                <a href="">我的订单</a>
            </div>
                
            </div>
        </div>
    </div>
    <!-- 2.search部分 -->
    <div class="search">
        <div class="search-content">
            <!-- 2.1左侧的logo -->
            <a class="logo" href=""><img src="images/logo.png" alt="天天生鲜的logo"></a>
            <!-- 2.2搜索框 -->
            <div class="searchbar">
                <form action="">
                    <input class="txt" type="text" placeholder="搜索">
                    <input class="btn" type="submit" value="搜索">
                </form>
            </div>
            <!-- 2.3右侧我的购物车 -->
            <div class="buycar">
                <a href="">我的购物车</a>
                <span>0</span>
            </div>
        </div>
    </div>
    
    <!-- 3.category 全部商品分类 -->
    <div class="category">
        <div class="category-content">
            <!-- 3.1全部商品分类 -->
            <a class="all" href="">全部商品分类</a>
            <!-- 3.2首页 -->
            <ul class="catelist">
                <li><a href="">首页</a></li>
                <li><span>|</span></li>
                <li><a href="">手机生鲜</a></li>
                <li><span>|</span></li>                
                <li><a href="">抽奖</a></li>
            </ul>
        </div>
    </div>
    <!-- 4.slide -->
    <div class="slide">
        <div class="slide-content">
            <!-- 4.1 左侧水果列表展示 -->
            <ul class="friutlist">
                <li><a href="">鲜鲜水果</a></li>
                <li><a href="">鲜鲜水果</a></li>
                <li><a href="">鲜鲜水果</a></li>
                <li><a href="">鲜鲜水果</a></li>
                <li><a href="">鲜鲜水果</a></li>
                <li><a href="">鲜鲜水果</a></li>
            </ul>
            <!-- 4.2中间部分 slide轮播图 -->
            <div class="slidepic">
                <!-- 4.2.1轮播图片 -->
                <ul class="slidelist">
                    <li><a href=""><img src="images/slide.jpg" alt="轮播图"></a></li>
                    <li><a href=""><img src="images/slide.jpg" alt="轮播图"></a></li>
                    <li><a href=""><img src="images/slide.jpg" alt="轮播图"></a></li>
                    <li><a href=""><img src="images/slide.jpg" alt="轮播图"></a></li>
                    
                </ul>
                <!-- 4.2.2 左右按钮 -->
                <div class="leftbtn"></div>
                <div class="rightbtn"></div>
                <!-- 4.2.3小圆点 -->
                <ul class="pointslist">
                    <li class="active"></li>
                    <li></li>
                    <li></li>
                    <li></li>
                </ul>
            </div>
            <!-- 4.3右侧图片 -->
            <div class="rightpic">
                <a href=""><img src="images/right01.jpg" alt="广告图1"></a>
                <a href=""><img src="images/right02.jpg" alt="广告图1"></a>
                
            </div>
        </div>
    </div>
    <!-- 5.foods 商品详情 -->
    <div class="foods">
        <div class="foods-content">
            <!-- 5.1头部的div -->
            <div class="head">
                <ul class="headlist">
                    <li class="sea"><a href=""> 海鲜水产</a></li>                            
                    <li><span>|</span></li>
                    <li><a href="">深海鲍鱼</a></li>
                    <li><span>|</span></li>                
                    <li><a href="">帝王蟹</a></li>
                </ul>
           
            <div class="headright"><a href="">更多>></a></div>
            </div>
            <!-- 5.2左侧的广告图片 -->
            <div class="leftad">
                <a href=""><img src="images/friut.jpg" alt="水果图"></a>
            </div>
            <!-- 5.3右侧的列表 产品展示 -->
            <ul class="foodslist">
                <!-- li>h5+(a>img)+div -->
                <li>
                    <h5>基围虾</h5>
                    <a href=""><img src="images/xia.jpg" alt="基围虾"></a>
                    <div>人民币: 39.9</div>
                </li>   
                <li>
                    <h5>基围虾</h5>
                    <a href=""><img src="images/xia.jpg" alt="基围虾"></a>
                    <div>人民币: 39.9</div>
                </li>  
                <li>
                    <h5>基围虾</h5>
                    <a href=""><img src="images/xia.jpg" alt="基围虾"></a>
                    <div>人民币: 39.9</div>
                </li>  
                <li>
                    <h5>基围虾</h5>
                    <a href=""><img src="images/xia.jpg" alt="基围虾"></a>
                    <div>人民币: 39.9</div>
                </li>                              
            </ul>
        </div>
    </div>

    <div class="foods">
        
        <div class="foods-content">
            <!-- 5.1头部的div -->
            <div class="head">
               
                    <ul class="headlist">
                        <li class="sea"><a href=""> 新鲜蔬菜</a></li>                            
                        <li><span>|</span></li>
                        <li><a href="">深海鲍鱼</a></li>
                        <li><span>|</span></li>                
                        <li><a href="">帝王蟹</a></li>
                    </ul>
               
                <div class="headright"><a href="">更多>></a></div>
            </div>
            <!-- 5.2左侧的广告图片 -->
            <div class="leftad">
                <a href=""><img src="images/vegetable.jpg" alt="蔬菜图"></a>
            </div>
            <!-- 5.3右侧的列表 产品展示 -->
            <ul class="foodslist">
                <!-- li>h5+(a>img)+div -->
                <li>
                    <h5>基围虾</h5>
                    <a href=""><img src="images/xia.jpg" alt="基围虾"></a>
                    <div>人民币: 39.9</div>
                </li>   
                <li>
                    <h5>基围虾</h5>
                    <a href=""><img src="images/xia.jpg" alt="基围虾"></a>
                    <div>人民币: 39.9</div>
                </li>  
                <li>
                    <h5>基围虾</h5>
                    <a href=""><img src="images/xia.jpg" alt="基围虾"></a>
                    <div>人民币: 39.9</div>
                </li>  
                <li>
                    <h5>基围虾</h5>
                    <a href=""><img src="images/xia.jpg" alt="基围虾"></a>
                    <div>人民币: 39.9</div>
                </li>                              
            </ul>
        </div>
    </div>

    <div class="foods">
        
        <div class="foods-content">
            <!-- 5.1头部的div -->
            <div class="head">
               
                    <ul class="headlist">
                        <li class="sea"><a href=""> 新鲜蔬菜</a></li>                            
                        <li><span>|</span></li>
                        <li><a href="">深海鲍鱼</a></li>
                        <li><span>|</span></li>                
                        <li><a href="">帝王蟹</a></li>
                    </ul>
               
                <div class="headright"><a href="">更多>></a> </div>
            </div>
            <!-- 5.2左侧的广告图片 -->
            <div class="leftad">
                <a href=""><img src="images/seafood.jpg" alt="蔬菜图"></a>
            </div>
            <!-- 5.3右侧的列表 产品展示 -->
            <ul class="foodslist">
                <!-- li>h5+(a>img)+div -->
                <li>
                    <h5>基围虾</h5>
                    <a href=""><img src="images/xia.jpg" alt="基围虾"></a>
                    <div>人民币: 39.9</div>
                </li>   
                <li>
                    <h5>基围虾</h5>
                    <a href=""><img src="images/xia.jpg" alt="基围虾"></a>
                    <div>人民币: 39.9</div>
                </li>  
                <li>
                    <h5>基围虾</h5>
                    <a href=""><img src="images/xia.jpg" alt="基围虾"></a>
                    <div>人民币: 39.9</div>
                </li>  
                <li>
                    <h5>基围虾</h5>
                    <a href=""><img src="images/xia.jpg" alt="基围虾"></a>
                    <div>人民币: 39.9</div>
                </li>                              
            </ul>
        </div>
    </div>

    <div class="foods">
        
        <div class="foods-content">
            <!-- 5.1头部的div -->
            <div class="head">
               
                    <ul class="headlist">
                        <li class="sea"><a href=""> 新鲜蔬菜</a></li>                            
                        <li><span>|</span></li>
                        <li><a href="">深海鲍鱼</a></li>
                        <li><span>|</span></li>                
                        <li><a href="">帝王蟹</a></li>
                    </ul>
               
                <div class="headright"><a href="">更多>></a></div>
            </div>
            <!-- 5.2左侧的广告图片 -->
            <div class="leftad">
                <a href=""><img src="images/meat.jpg" alt="蔬菜图"></a>
            </div>
            <!-- 5.3右侧的列表 产品展示 -->
            <ul class="foodslist">
                <!-- li>h5+(a>img)+div -->
                <li>
                    <h5>基围虾</h5>
                    <a href=""><img src="images/xia.jpg" alt="基围虾"></a>
                    <div>人民币: 39.9</div>
                </li>   
                <li>
                    <h5>基围虾</h5>
                    <a href=""><img src="images/xia.jpg" alt="基围虾"></a>
                    <div>人民币: 39.9</div>
                </li>  
                <li>
                    <h5>基围虾</h5>
                    <a href=""><img src="images/xia.jpg" alt="基围虾"></a>
                    <div>人民币: 39.9</div>
                </li>  
                <li>
                    <h5>基围虾</h5>
                    <a href=""><img src="images/xia.jpg" alt="基围虾"></a>
                    <div>人民币: 39.9</div>
                </li>                              
            </ul>
        </div>
    </div>

    <!-- 6.底部  -->
    <div class="bottom">
        <ul class="oneline">
            <li><a href="">关于我们</a></li>
            <li><span>|</span></li>
            <li><a href="">联系我们</a></li>
            <li><span>|</span></li>
            <li><a href="">招聘人才</a></li>
            <li><span>|</span></li>
            <li><a href="">友情链接</a></li>
        </ul>
        <ul class="twoline">CopyRight &copy 2016 北京天天生鲜信息技术有限公司ALL Right Reserved</ul>
        <ul class="threeline">电话：010-****888  京ICP备*******8号</ul>
        <!-- <ul>河南理工大学</ul> -->

    </div>

</body>
</html>